<template>
    <div>
        <span style="font-size: 20px;">您当前店内洗衣步骤如下</span>
        <el-steps :active="tableData.length" align-center style="margin-top: 30px">
            <el-step v-for="item in tableData" :title="item.stepName"></el-step>
        </el-steps>
<!--        <div>-->
<!--            <el-table :data="tableData" ref="steplist" row-key="stepId" width="100%">-->
<!--                <el-table-column label="序号" type="index" align="center" width="50">-->

<!--                </el-table-column>-->
<!--                <el-table-column prop="vipKindName" label="名称" min-width="180" />-->
<!--            </el-table>-->
<!--        </div>-->
    </div>
</template>

<script>
    import request from "@/request";

    export default {
        name: "Step",
        data() {
            return {
                tableData: [],
            }
        },
        mounted() {
            this.load()
        },
        methods: {

            load() {
                request.get('/step/getall').then(res => {
                    if (res.code === "200") {
                        this.tableData = res.data;

                    }
                })
            },
        }
    }
</script>

<style scoped>

</style>